<template>
  <div v-if="this.$route.name == 'devicedata'" class="app-container">
    <vue-element-loading :active="this.$store.state.elementloading.vueElementLoading" spinner="spinner" color="#FF6700"/>
    <el-card shadow="never">
    <!-- 数据列表
：data 绑定渲染的数据 
border 表格边框
    -->

    <el-table
      :data="list"
      max-height="570"
      stripe
      border
      style="width: 100%"
      highlight-current-row
      @current-change="handleSelectionChange"
      @row-click="chooseone"
    >
      <el-table-column width="55">
        <template slot-scope="scope">
          <el-radio v-model="radio" :label="scope.row.id">
            <span class="el-radio__label"></span>
          </el-radio>
        </template>
      </el-table-column>
      <!-- type="index"获取索引值，labal显示标题，prop 数据字段名 -->
      <el-table-column type="index" label="序号" width="50"></el-table-column>
      <el-table-column prop="tSerialNumber" label="设备编号"></el-table-column>
      <el-table-column prop="tTemperature" label="空气温度"></el-table-column>
      <el-table-column prop="tHumidity" label="空气湿度"></el-table-column>
      <el-table-column prop="tLightIntensity" label="光照强度"></el-table-column>
      <el-table-column prop="tSoilTemperature" label="土壤温度"></el-table-column>
      <el-table-column prop="tSoilHumidity" label="土壤湿度"></el-table-column>
      <el-table-column prop="tSoilPh" label="土壤ph值"></el-table-column>
      <el-table-column prop="tCreateTime" label="采集日期"></el-table-column>
      <el-table-column v-if="btnshow('devicedata-delete')" align="center" label="操作" width="105">
        <template slot-scope="scope">
          <el-button size="mini" type="danger" @click="handleDelete(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[5,10,15,20]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    ></el-pagination>
    </el-card>
  </div>
</template>

<script src="./devicedata.js"></script>